<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ include file="/website/common/base.jsp"%>

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>${webname }-会员中心</title>
<%@ include file="/website/common/common.jsp"%>
<link href="${webctx }/css/manage.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="${webctx}/js/sms.js"></script>
</head>

<body>
<%@ include file="/website/common/top.jsp"%>
<%@ include file="/website/common/head.jsp"%>
<%@ include file="/website/common/menu.jsp"%>

<div class="warp-body">
	<div class="inner clearfix">
    	<div class="left-main">
        	<div class="left-inner">
            	<%@ include file="/website/user/left.jsp"%>
            </div>
        </div>
    	<div class="right-main">
        	<div class="right-inner" id="page1">
            	<div class="right-title"><span></span>修改手机绑定</div>
                <div class="modPh-inner">
                    <ul class="items">
                        <li class="item">
                            <div class="item-title">已验证手机：</div>
                            <div class="itemInp-ct">
                            	<input name="uphone" type="hidden" value="${user.loginphone}">
                            	<div class="text">${user.loginphone.substring(0,3) }*****${user.loginphone.substring(8,user.loginphone.length()) }</div>
                            </div>
                        </li>
                        <li class="item">
                			<div class="item-title">短信验证码：</div>
                            <div class="itemInp-ct">
                                <div class="ipt norWidthIpt"><input name="oldsmscode" type="text" class="inp" placeholder="填写短信校验码" style="width:200px;height:36px;line-height:36px;border-width:0px"></div>
                                <a href="javascript:tosendsms();" class="yzm-btn" id="yzmbtn">发送验证码</a>
                            </div>
                            <div class="itemTip" id="itemTip_old"></div>
                		</li>               
                        <li class="item">
                            <div class="itemInp-ct pt-20"><a href="javascript:tonext();" class="reg-btn">下一步</a></div>
                        </li>
                    </ul>	
                </div>     	
                
            </div>
            <div class="right-inner hide" id="page2">
            	<div class="right-title"><span></span>修改新手机绑定</div>
                <div class="modPh-inner">
                    <ul class="items">
                        <li class="item">
                            <div class="item-title">新手机号：</div>
                            <div class="itemInp-ct">
                    			<div class="ipt norWidthIpt"><input name="newphone" type="text" class="inp" placeholder="请输入手机号码" style="border-width:0px;height:36px;line-height:36px;"></div>
                    		</div>
                            <div class="itemTip" id="itemTip_p"></div>
                        </li>
                        <li class="item">
                			<div class="item-title">验证码：</div>
                            <div class="itemInp-ct">
                                <div class="ipt norWidthIpt"><input name="newsmscode" type="text" class="inp" placeholder="填写短信校验码" style="width:200px;border-width:0px;height:36px;line-height:36px;"></div>
                                <a href="javascript:tosendsms2();" class="yzm-btn" id="yzmbtn2">发送验证码</a>
                            </div>
                            <div class="itemTip" id="itemTip_s"></div>
                		</li>               
                        <li class="item">
                            <div class="itemInp-ct pt-20"><a href="javascript:tonext2();" class="reg-btn">下一步</a></div>
                        </li>
                    </ul>	
                </div> 
            </div>
            <div class="right-inner hide" id="page3">
            	<div class="right-title"><span></span>修改手机</div>
                <div class="modif-inner">
                	<div class="modif-txt">
                    	<div><span class="modif-icon"></span></div>
                    	<div>您已成功修改手机号码，点击此处 <a href="${ctx }manage">返回账户管理中心</a></div>
                    </div>
                </div> 
            </div>
        </div>
    </div>
</div>

<%@ include file="/website/common/foot.jsp"%>
</body>
</html>
<script>
$(function(){
	setLeftCur("zhugl");
	
})

function tosendsms(){
	sendsms($("[name='uphone']").val(),'changephone','yzmbtn');
}

function tosendsms2(){
	if($("[name='newphone']").val()==$("[name='uphone']").val()){
		$("#itemTip_p").text("请输入新手机号");
	}else if(!$w.isMobile($("[name='newphone']").val())){
		$("#itemTip_p").text("请输入正确手机号");
	}else
		sendsms($("[name='newphone']").val(),'changephone','yzmbtn2');
}

function tonext(){
	$("#page1 .itemTip").text('');
	$w.httpRequest({
		url:apiroot+"/user/checksmscode",
		data:{"mobile":$("[name='uphone']").val(),"smscode":$("[name='oldsmscode']").val()},
		ok:function(ret){
			if(ret.Data=='true'){
				$("#page1").hide();
				$("#page2").show();
				curlimit=0;
				smssending=false;
			}else $("#itemTip_old").text('验证码错误');
		}
	})
}
function tonext2(){
	$("#page2 .itemTip").text('');
	if(!$w.isMobile($("[name='newphone']").val())){
		$("#itemTip_p").text("请输入正确手机号");
	}else{
		$w.httpRequest({
			url:apiroot+"/user/changephone",
			data:{"oldphone":$("[name='uphone']").val(),"newphone":$("[name='newphone']").val(),"oldsmscode":$("[name='oldsmscode']").val(),"newsmscode":$("[name='newsmscode']").val()},
			ok:function(ret){
				$("#page2").hide();
				$("#page3").show();
			},fail:function(ret){
				$("#itemTip_s").text(ret.MsgDesc);
				return false;
			}
		})
	}
}
</script>